<template>
	<view>
		<view class="wrap" v-show="motaishow">
			<view class="wrap-view">
				<view class="wrap-text">请登陆后在操作</view>
				<view class="wrap-flex">
					<button plain="true" @click="centerMotai">取消</button>
					<button plain="true" open-type="getUserInfo" @getuserinfo="getUserInfo" >去登录</button>
				</view>
			</view>
		</view>
		<!-- 反馈组件 -->
		<HMmessages ref="HMmessages" @complete="HMmessages = $refs.HMmessages" @clickMessage="clickMessage"></HMmessages>
	</view>
</template>

<script>
	//引入操作数据库
	import loadingUser from './users.js'
	//顶部消息提示插件
	 import HMmessages from "@/components/HM-messages/HM-messages.vue"
	export default{
		data(){
			return{
				motaishow:false
			}
		},
		components:{
			HMmessages,//顶部提示
		},
		methods:{
			getUserInfo(e){
				// console.log(e.detail.userInfo)
				this.motaishow = false
				let user = e.detail.userInfo
				loadingUser(user).then(res=>{
					console.log(res)
					this.HMmessages.show("登录成功",{icon:'success',fontColor:'#000000',background:'#f40000',iconColor:'#000000'})
				})
				.catch(err=>{
					console.log(err)
				})
			},
			
			//弹出模态框
			init(){
				this.motaishow = true
			}
		},
		//取消模态
		centerMotai(){
			this.motaishow = false
		}
	}
</script>

<style scoped>
	.wrap{
		position: fixed;
		left: 0;right: 0;
		top: 0;bottom: 0;
		background: rgba(0,0,0,0.5);
		z-index: 9999;
	}
	.wrap-view{
		width: 500upx;
		height: 200upx;
		background-color: #ffffff;
		margin: auto;
		position: absolute;
		-webkit-position: absolute;
		left: 0;right: 0;
		top: 0;bottom: 0;
		border-radius: 10upx;
		overflow: hidden;
	}
	.wrap-text{
		padding-top: 10upx;
		margin-top: 20upx;
		text-align: center;
		font-size: 34upx;
		color: #666666;
	}
	.wrap-flex{
		display: flex;
		justify-content: space-around;
		border-top: 1upx solid #eeeeee;
		position: absolute;
		left: 0;right: 0;
		bottom: 0;
		height: 80upx;
		line-height: 80upx;
	}
	.wrap-flex button{
		border: none;
		font-size: 30upx;
	}
</style>
